<!DOCTYPE html>
<html lang='en'>

<head>
  <meta charset='UTF-8'>
  <meta http-equiv='X-UA-Compatible' content='IE=edge'>
  <meta name='viewport' content='width=device-width, initial-scale=1.0'>
  <title>Document</title>
  <script src="./data/data.js"></script>
</head>

<body>
  <h2>结果在控制台~~</h2>
  路径：<input type="text" id="input1">
  <br>
  <br>
  内容：<textarea name="" id="textarea1" cols="30" rows="10"></textarea>
  <br>
  <br>
  <button type="button" onclick="GET()">GET</button></button>
  <button type="button" onclick="SET()">SET</button></button>

  <script>
    let input1 = document.getElementById("input1")
    let textarea1 = document.getElementById("textarea1")

    function GET() {
      fetch(`/get?target=${input1.value.trim()}`, {}).then(response => {
        if (response.status >= 200 && response.status < 300) { // 判断请求是否成功
          return response.json() // 得到 JSON 对象
        } else {
          throw new Error(response.statusText);
        }
      }).then(json => {
        console.log(json);  // 得到最终结果。
      }).catch(err => {
        console.log('Request Failed', err)
      });
    }
    let dd = [];
    function SET() {
      try {
        dd = textarea1.value
        dd = JSON.parse(dd.trim());
        console.log(dd)
      } catch (error) {
        alert('不是正确的json格式，请检查：逗号，双引号之类')
        return;
      }
      setValue(input1.value.trim(), dd)
    }
    function setValue(target, json) {
      fetch(`/set?target=${target}`, {
        method: 'POST', // HTTP 请求的方法，POST、DELETE、PUT都在这个属性设置。
        headers: {	// 一个对象，用来定制 HTTP 请求的标头。
          'Content-Type': 'application/json;charset=utf-8'
        },
        body: JSON.stringify(json),	// POST 请求的数据体。
      }).then(response => {
        if (response.status >= 200 && response.status < 300) { // 判断请求是否成功
          return response.json() // 得到 JSON 对象
        } else {
          throw new Error(response.statusText);
        }
      }).then(json => {
        console.log(json);  // 得到最终结果。
      }).catch(err => {
        console.log('Request Failed', err)
      });
    }

    setValue('kuaijiejian', kuaijiejian);
    setValue('shipingdizhi', shipingdizhi);
  </script>

</body>

</html>